<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title>Fill Table Hit Test</title>
  <style>
    body { margin: 0px 0px 0px 0px; }
  </style>
  <script language="JavaScript" type="text/javascript">
    var cellHeight = 20; 
    var logMsg = "";
    var lastSuccess = 0;
    var failed = false;

    if (window.testRunner) {
        testRunner.dumpAsText();
        testRunner.waitUntilDone();
    }

    function cellHit(cell) {
      var cellId = 24 * cell.parentNode.rowIndex  + cell.cellIndex;
      lastSuccess = cellId;
    }

    function doTest(cellwidth) {
      var ypos = cellHeight;
      for (var row = 0; row < 24; row++) {
        var xpos = cellwidth;
        for (var col = 0; col < 19; col++) {
          var cellId = 24 * row + col;
          logMsg += "Attempting to hit cell at row: " + row + ", column: " + col + ": ";
          var elem = document.elementFromPoint(xpos, ypos);
          if (elem) elem.onmousemove();
          var success = lastSuccess == cellId;
          if (!success) failed = true;
          logMsg += (success ? "SUCCESS" : "FAIL") + "<br />";
          xpos += cellwidth + 1;
        }
        ypos += cellHeight;
      }
      document.body.innerHTML =(failed ? "FAIL!!!<br/>" : "SUCCESS!!!<br/>") +logMsg;
      if (window.testRunner) {
          testRunner.notifyDone();
      }
    }

    function CreateTable(tablewidth, rowcount, colcount) {
      var cellwidth = (tablewidth / colcount) - 1;
      var tablestr = "<table style=\"table-layout:fixed;\" border=\"1\" width=\"" + 
                     tablewidth + "\" cellspacing=\"0\" cellpadding=\"0\">";
      for (var row = 0; row < rowcount; row++) {
        var rowstr = "<tr height=\"20\">";
        for (var col = 0; col < colcount; col++) {
          var cellId = "r" + row + "c" + col;
          var colstr = "<td width=\"" +  cellwidth + "\" id=\"" + cellId + "\" onmousemove=\"cellHit(this)\"></td>";
          rowstr += colstr;
        }
        rowstr += "</tr>";
        
        tablestr += rowstr;
      }
      tablestr += "</table>";
      document.getElementById('tablebox').innerHTML = tablestr;
      doTest(Math.round(cellwidth));
    }
  </script>
</head>

<body onload="CreateTable(500, 50, 20);" >
  <div id="tablebox" style="overflow:hidden; width:500px; height:500px;"></div>
</body>

</html>

